<template>
    <tab-bar>

    <tab-bar-item link="/home"> 
      <template #item-icon><img  src="../../../assets/img/tabbar/home.svg" alt="" /></template>
      <template #item-icon-active><img  src="../../../assets/img/tabbar/home_active.svg" alt="" /></template>
      <template #item-text><div>首页</div></template>
    </tab-bar-item>

      <tab-bar-item link="/category">
      <template #item-icon><img  src="../../../assets/img/tabbar/category.svg" alt="" /></template>
      <template #item-icon-active><img  src="../../../assets/img/tabbar/category_active.svg" alt="" /></template>
      <template #item-text><div>分类</div></template>
    </tab-bar-item>

    <tab-bar-item link="/cart">
      <template #item-icon><img  src="../../../assets/img/tabbar/shopcart.svg" alt="" /></template>
      <template #item-icon-active><img  src="../../../assets/img/tabbar/shopcart_active.svg" alt="" /></template>
      <template #item-text><div>购物车</div></template>
    </tab-bar-item>

    <tab-bar-item link="/profile">
      <template #item-icon><img  src="../../../assets/img/tabbar/profile.svg" alt="" /></template>
      <template #item-icon-active><img  src="../../../assets/img/tabbar/profile_active.svg" /></template>
      <template #item-text><div>我的</div></template>
    </tab-bar-item>
    
      </tab-bar>

</template>

<script>
import TabBar from "../../common/tabbar/TabBar";
import TabBarItem from "../../common/tabbar/TabBarItem";

export default {
  name: "MainTabbar",
  components: {
    TabBar,
    TabBarItem,
  },
};
</script>

<style>
  
</style>